<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:s="http://jboss.com/products/seam/taglib"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:rich="http://richfaces.org/rich"
                template="embed/template.xhtml">
                
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <ui:define name="topnav">
            <ui:include src="/embed/menu.xhtml">
                <ui:param name="page" value="home" />
            </ui:include>
   </ui:define> 
   
    <ui:define name="sidebar">
        <ui:include src="/login/login.xhtml" />
   </ui:define>
   <ui:define name="search">   
 
    <ui:include src="/embed/search.xhtml" />
    </ui:define>
  <ui:define name="body">   

    <div class="productbox" >
    

    
    
            <h1>我的购物车</h1>       
            <f:subview id="emptycart" rendered="#{empty cart.cart}">
                <p>你的购物车是空的！</p>


                <h:form>
                     <s:button view="/home.xhtml" value="继续购物"/>  
                </h:form>
            </f:subview>

            <div id="shoppingcart">
            <f:subview id="cartdetails" rendered="#{not empty cart.cart}">
                <h:form id="myform">
                  <table width="760" cellpadding="5" cellspacing="0" border="1" >
                    <tr bgcolor='#fffccc'>
                    <h:dataTable value="" var=""></h:dataTable>
                    <h:dataTable value="#{cart.cart}" var="item"
                                 styleClass="dvdtable" 
                                 headerClass="dvdtablehead"
                                 rowClasses="dvdtableodd,dvdtableeven"
                                 columnClasses="dvdtablecol"
                                 id="table"
                                 >

                      
                        <h:column>
                            <f:facet name="header">
                                <h:outputText id="remove" value="#{messages.cartRemoveColumn}" />
                            </f:facet>
                            <h:selectBooleanCheckbox value="#{cart.cartSelection[item]}"/>
                        </h:column>
                                    
                                               
                        
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="#{messages.cartPriceColumn}" />
                            </f:facet>
                            <h:outputText value="#{item.product.price}">
                                <f:convertNumber type="currency" currencySymbol="￥" />
                            </h:outputText>
                        </h:column> 
                        
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="#{messages.cartColorColumn}" />
                            </f:facet>
                            <h:outputText value="#{item.product.color}" />
                        </h:column>    
                         
                          <h:column>
                            <f:facet name="header">
                                <h:outputText value="#{messages.cartSizeColumn}" />
                            </f:facet>
                            <h:outputText id="mysize" value="#{item.product.size}" />
                        </h:column>    
                                               
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="#{messages.cartQuantityColumn}" />
                            </f:facet>
                            <h:inputText id="number" value="#{item.itemNumber}" size="4" />
                        </h:column>                      
                    </h:dataTable>
                    </tr>
                     <s:button view="/home.xhtml" value="继续购物"/>  
                    &#160;
                    <h:commandButton action="#{cart.resetCart}"  
                                     value="清空购物车"  />
                    &#160;
                    <h:commandButton action="#{cart.updateCart}" 
                                     value="#{messages.checkoutUpdateButton}" />
                    
                  </table>
                </h:form>
                
                <div style="width: 30%;">
                    <div class="cntInfo" style="float:none;">
                        <h:panelGrid columns="2">
                            <h:outputText value="#{messages.checkoutSubtotal}" />
                            <h:outputText id="subtotal" value="#{cart.subtotal}">
                                <f:convertNumber type="currency" currencySymbol="￥" />
                            </h:outputText>                                                                                                             
                        </h:panelGrid>
                        
                        
                        <f:subview id="purchaseaction" rendered="#{identity.loggedIn}">
                            <h:form>
                                <h:commandButton action="#{checkout.createOrder}"  
                                                 value="#{messages.checkoutPurchaseButton}"  />
                            </h:form>
                        </f:subview>
                    </div>
                    
                    <f:subview id="notloggedin" rendered="#{!identity.loggedIn}">
                        <p class="warning">你必须要首先登陆才能订购！</p>
                    </f:subview>
                </div>
            </f:subview>
          </div>
         </div>
         
         
    <script>
			
			
    		//input失去焦点，重新计算价格
    		
    		var table = $("#cartdetails\\:myform\\:table");  //购物车table  		
    		
    		table.find("input").blur(function(){ 			 
	    	    var trCount = table.find("tr").size();   //总行数，即购物项总数
	    	    var sum = 0;
	    	    var temp = 1;
	    	    while((trCount-1) >= temp)						 //eq 从0开始,所以终止值为trCount-1
	    	    {
	    	    	var thisTr = table.find("tr").eq(temp);     //eq 从0开始
	    	    	
	    	    	var priceStr = thisTr.find("td").eq(1).html();
	    	    	var price = parseFloat(priceStr.substring(1,priceStr.length));           //单价
	    	    	var count = parseFloat(thisTr.find("td").eq(4).find("input").val());			//数量
	    	    	
	    	    	sum = sum + price*count;
	    	    	temp ++;
	    	    	
	    	    }

	    	   sum = sum.toFixed(2);			//保留两位小数，IE5.5+ 才能使用
	    	    $("#cartdetails\\:subtotal").text("￥"+sum);                  //把价格写回subtotal
	    	 });
			
    </script>
    
    
        </ui:define>
</ui:composition>






